import 'package:flutter/material.dart';
import 'package:flutter_staggered_grid_view/flutter_staggered_grid_view.dart';
import 'package:get/get.dart';
import 'package:xindong/common/xindong_sezhi.dart';
import 'package:xindong/models/xindong_noble_class.dart';
import 'package:xindong/routes/user/noble/xindong_noble_ctr.dart';
import 'package:xindong/widgets/container/xindong_empty_container.dart';

class XinDongNobleListView extends StatelessWidget {
  const XinDongNobleListView({super.key});

  @override
  Widget build(BuildContext context) {
    return GetBuilder<XinDongNobleCtr>(initState: (state) async {
      XinDongNobleCtr.to.requestGetList();
    }, builder: (controller) {
      return XinDongEmptyContainer(
        dataList: controller.dataList,
        child: AlignedGridView.count(
          itemCount: controller.dataList.length,
          crossAxisCount: 3,
          mainAxisSpacing: 10,
          crossAxisSpacing: 10,
          shrinkWrap: true,
          physics: const NeverScrollableScrollPhysics(),
          itemBuilder: (BuildContext context, int index) {
            final model = controller.dataList[index];
            return _buildGridItem(model, () => controller.setSelectClass(model));
          },
        ),
      );
    });
  }

  Widget _buildGridItem(XinDongNobleClass model, Function() onTap) {
    return GestureDetector(
      onTap: onTap,
      child: GetBuilder<XinDongNobleCtr>(
          id: 'model',
          builder: (walletController) {
            bool isSelectClass = walletController.isSelectClass(model);
            Color color = isSelectClass ? DZColors.mainColor : DZColors.contentColor;
            return Container(
              height: 90,
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(8),
                color: DZColors.cellColor,
                border: Border.all(color: isSelectClass ? DZColors.mainColor : DZColors.placeholderColor, width: 1),
              ),
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Text(
                    "￥${model.price}",
                    style: TextStyle(color: color, fontSize: 14, height: 1.2),
                  ),
                  const SizedBox(height: 5),
                  Text(
                    model.name,
                    style: TextStyle(color: color, fontSize: 18, fontWeight: FontWeight.w500),
                  ),
                  const SizedBox(height: 5),
                  Text(
                    model.style_name,
                    style: TextStyle(color: color, fontSize: 12, fontWeight: FontWeight.w500),
                  ),
                ],
              ),
            );
          }),
    );
  }
}
